<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        span{
            display: inline-block;
            width: 90px;
            height: 40px;
            line-height: 40px;
            font-size: 24px;
            color: rgb(155, 40, 9);
            background-color: aquamarine;
            text-align: center;
        }
    </style>
</head>
<body>
    <span id="year"></span>
    <span id="month"></span>
    <span id="date"></span>
    <span id="hour"></span>
    <span id="minutes"></span>
    <span id="seconds"></span>
    <span id="day"></span>

    <script>
        //创建Date对象 
        var now = new Date();//获取当前的年月日 时分秒 星期
        document.write(now+'<br>');
        //创建指定时间的Date对象
        var before = new Date('2024-4-4 10:12:15');
        document.write(before+'<br>');
        var after = new Date(2024,4,1,12,10,10);//月份从0-11
        document.write(after+'<br>');
        //方法组 （get***） (set***)
        //获取当前时间的年份、月份、日期、小时、分钟、秒钟
        document.write(now.getFullYear()+'年<br>');
        document.write((now.getMonth()+1)+'月<br>');
        document.write(now.getDate()+'日<br>');
        document.write(now.getHours()+'时<br>');
        document.write(now.getMinutes()+'分<br>');
        document.write(now.getSeconds()+'秒<br>');
        document.write(now.getDay()+'星期<br>');
        //获取span标签  通过innerHTML属性  给span标签添加内容
        document.getElementById('year').innerHTML = now.getFullYear()+'年';
        document.getElementById('month').innerHTML = now.getMonth()+1+'月';
        document.getElementById('date').innerHTML = now.getDate()+'日';
        document.getElementById('hour').innerHTML = now.getHours()+'时';
        document.getElementById('minutes').innerHTML = now.getMinutes()+'分';
        document.getElementById('seconds').innerHTML = now.getSeconds()+'秒';
        document.getElementById('day').innerHTML = "星期"+now.getDay();

        document.write(before.setFullYear(2025)+'<br>');
        document.write(before.getFullYear()+'<br>');
    </script>
</body>
</html>